<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="/res/third/bootstrap3/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="/res/common/js/jquery.1.9.1.min.js" type="text/javascript"></script>
<script src="/res/third/artDialog/jquery.artDialog.js" type="text/javascript"></script>
<script src="/res/third/validate/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
	function sosuo() {
		var lpath = location.pathname;
		$("#soform").attr("action", lpath + "?pageNo=" + 1);

		$("#soform").submit();
	}
</script>
</head>

<body>
	<div class="panel panel-info panel-content">
		<div class="panel-heading">
			<button style="float: right" type="button" onclick="addchannel()" class="btn btn-info">
				<span class="glyphicon glyphicon-plus"></span>
				&nbsp;新增推荐位
			</button>
			<form id="soform" method="post">
				<table>
					<tr>
						<td class="w80" style="padding-top: 5px">
							<label for="name" class="center-block">推荐位名称：</label>
						</td>
						<td class="w150 ">
							<input type="text" class="form-control" name="so_name" value="${so_name!}" id="so_name" placeholder="" data-options="">
						</td>
						<td style="padding-left: 10px">
							<div class="input-group">
								<span class="input-group-btn">
									<button class="btn btn-default" type="button" onclick="sosuo()">搜索</button>
								</span>
							</div>
						</td>
					</tr>
				</table>
			</form>
		</div>
		<table class="table table-hover table-bordered table-striped table-condensed">
			<thead>
				<tr>
					<th width="10">序号</th>
					<th width="35%">推荐位名称</th>
					<th width="20%">文章数量</th>
					<th width="35%">操作</th>
				</tr>
			</thead>
			[#list pagination.list as channel ]
			<tr>
				<td align="center">${channel_index + 1}</td>
				<td align="center">${channel.channelName!}</td>
				<td align="center">${channel.count!}</td>
				<td align="center">
					<button type="button" class="btn btn-danger btn-xs delbtn" onclick="edit('${channel.id}','${channel.channelName!}','${channel.code!}')">编辑</button>
					[#if channel.count == '0']<button type="button" class="btn btn-danger btn-xs delbtn" onclick="del('${channel.id}')">删除</button>[/#if]
					<button type="button" class="btn btn-danger btn-xs delbtn" onclick="detail('${channel.id}')">管理</button>
				</td>
			</tr>
			[/#list]
		</table>

		<div class="panel-footer">[@fenye p = pagination form = 'infoForm' /]</div>
	</div>


	<!-- 新增的弹出页 -->
	<div id="addchannel" style="width: 400px; height: 150px; display: none;">
		<form id="addform" method="post" class="form-horizontal" role="form">

			<div class="form-group">
				<label class="col-sm-3 control-label" id="clickforpro">推荐名称</label>
				<div class="col-sm-7">
					<input type="text" class="form-control" placeholder="" min="1" required="required" name="channelName" id="addname">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label" id="clickforpro">栏位标识</label>
				<div class="col-sm-7">
					<input type="text" class="form-control" placeholder="" min="1" required="required" name="code" id="addcode">
				</div>
			</div>
			

			<div class="form-group" style="margin-top: 10px;">
				<div class="col-sm-offset-3 col-sm-10">
					<input id="addsubmit" onclick="subadd()" type="button" class="btn btn-default" value="提交" />
				</div>
			</div>
		</form>
	</div>

	<!-- 编辑的弹出页 -->
	<div id="editchannel" style="width: 400px; height: 150px; display: none;">
		<form id="editform" method="post" class="form-horizontal" role="form">
			<input type="hidden" name="id" id="editid">
			<div class="form-group">
				<label class="col-sm-3 control-label" id="clickforpro">推荐名称</label>
				<div class="col-sm-7">
					<input type="text" class="form-control" placeholder="" min="1" required="required" name="channelName" id="editname">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-3 control-label" id="clickforpro">栏位标识</label>
				<div class="col-sm-7">
					<input type="text" class="form-control" placeholder="" min="1" required="required" name="code" id="editcode">
				</div>
			</div>

			<div class="form-group" style="margin-top: 10px;">
				<div class="col-sm-offset-3 col-sm-10">
					<input id="editsubmit" onclick="subedit()" type="button" class="btn btn-default" value="提交" />
				</div>
			</div>
			
			
		</form>
	</div>




</body>
</html>
<script type="text/javascript">
	//展示新增窗口
	function addchannel() {
		dialog = art.dialog({
			title : "新增栏位",
			lock : true,
			content : document.getElementById('addchannel')
		});
	}
	//删除
	function del(id) {//弹出警告框判断是否删除
		if (confirm('是否确认删除')) {
			$.ajax({
				url : '/recommend/ajax_del.do',
				type : 'get',
				dataType : 'json',
				data : {
					id : id
				},
				beforeSend : function() {
					art.dialog.tips("删除中...");
				},
				success : function(data) {
					if (data.success) {
						location.reload();
					} else {
						error_msg(data.msg, function() {
							location.reload();
						});
					}
				}
			});
		}
	}

	//打开编辑窗口
	function edit(id, name, code) {
		$("#editid").val(id);
		$("#editname").val(name);
		$("#editcode").val(code);
		dialog = art.dialog({
			title : "修改栏位",
			lock : true,
			content : document.getElementById('editchannel')
		});
	}
	//新增提交
	function subadd(){
	[#--提交之前 form 要手动进行验证--]
	
	var name = $("input[id='addname']").val();
	if (!name) {
		alert('推荐名称必须填写!');
		return;
	}
	var code = $("input[id='addcode']").val();
	if (!code) {
		alert('栏位标识必须填写!');
		return;
	}
	
	art.dialog.post({
		url: "/recommend/ajax_save.do",
        data:$("#addform").serialize(),
        success: function(data){
            if(data.success){
                location.reload();
            }else{
            	alert(data.msg)
            }
        }
	},"加载中...");
	
	}
	
	//编辑提交
	function subedit(){
	[#--提交之前 form 要手动进行验证--]
	
	var name = $("input[id='editname']").val();
	if (!name) {
		alert('推荐名称必须填写!');
		return;
	}
	var code = $("input[id='editcode']").val();
	if (!code) {
		alert('栏位标识必须填写!');
		return;
	}
	
	art.dialog.post({
		url: "/recommend/ajax_edit.do",
        data:$("#editform").serialize(),
        success: function(data){
            if(data.success){
                location.reload();
            }else{
            	alert(data.msg)
            }
        }
	},"加载中...");
	}
	
	function detail(id){
		window.location.href="/recommend/"+id+"/content_list.do";
	}

</script>